<div class="widgets">

  <div class="row">
    <div class="col-xs-12">
      <ba-card baCardClass="with-scroll">
        <div class="section">
          <form (ngSubmit)="search()" class="form-horizontal">
            <div class="form-group row">

              <div class="col-sm-5">
                <label for="idcard" class="col-sm-5 control-label">身&nbsp;&nbsp;份&nbsp;&nbsp;证</label>
                <div class="col-sm-7">
                  <input [(ngModel)]="searchForm.idcard" name="idcard" type="text" class="form-control">
                </div>
              </div>

              <div class="col-sm-5">
                <label for="name" class="col-sm-5 control-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</label>
                <div class="col-sm-7">
                  <input [(ngModel)]="searchForm.name" name="name" type="text" class="form-control">
                </div>
              </div>

            </div>

            <div class="form-group row">

              <div class="col-sm-5">
                <label for="type" class="col-sm-5 control-label">申请类型</label>
                <div class="col-sm-7">
                  <select [(ngModel)]="searchForm.type" name="type" type="text" class="form-control">
                    <option value="">全部</option>
                    <option value="质量员">质量员</option>
                    <option value="施工员">施工员</option>
                    <option value="安全员">安全员</option>
                    <option value="标准员">标准员</option>
                    <option value="材料员">材料员</option>
                    <option value="机械员">机械员</option>
                    <option value="劳务员">劳务员</option>
                    <option value="资料员">资料员</option>
                  </select>
                </div>
              </div>

              <div class="col-sm-5">
                <label for="verified" class="col-sm-5 control-label">申请状态</label>
                <div class="col-sm-7">
                  <select [(ngModel)]="searchForm.verified" name="verified" type="text" class="form-control">
                    <option value="可申请">可申请</option>
                    <option value="待审核">待审核</option>
                    <option value="通过">通过</option>
                    <option value="未通过">未通过</option>
                    <option value="">全部</option>
                  </select>
                </div>
              </div>
            </div>
            <div class="form-group row">
              <div class="col-sm-5">
                <label id="publishTimeLabel" class="col-sm-5 control-label" for="startdate">时&nbsp;&nbsp;间&nbsp;&nbsp;段</label>

                <div class="col-sm-7" id="publishTimeCol">
                  <date-range-picker (onSelected)="updateDateRange($event)"></date-range-picker>
                </div>
              </div>

              <div class="col-sm-5"></div>

              <div class="col-sm-2">
                <button type="submit" class="btn btn-primary pull-left"><i class="fa fa-search" aria-hidden="true"></i>
                  查询
                </button>
              </div>
            </div>
          </form>
        </div>
        <div class="section btn-section btn-toolbar">
          <a role="button" class="btn btn-primary btn-review" [ngClass]="{'disabled': disableApplyBtn}"
             (click)="addApply()">添加申请</a>
          <a role="button" class="btn btn-primary btn-review" [ngClass]="{'disabled': disableReviewBtn}"
             (click)="review()">查看详情</a>
          <a role="button" class="btn btn-primary btn-review" [ngClass]="{'disabled': disableBatchDownloadBtn}"
             href="{{batchDownloadUrl}}" download target="_blank" *ngIf="type === 'company'">下载汇总表</a>
          <a role="button" class="btn btn-primary btn-review" [ngClass]="{'disabled': disableDownloadBtn}"
             href="{{downloadUrl}}" download target="_blank">下载申请</a>
          <a role="button" class="btn btn-danger btn-reject" [ngClass]="{'disabled': disableDeleteBtn}"
             (click)="showDeleteModal()">删除</a>
          <span *ngIf="errorShow">请重新登录</span>
        </div>
        <div class="section">
          <data-tables [searchParams]="searchForm" [config]="dataTablesConfig"
                       (onSelect)="tableRowSelect($event)"  (onError)="handleError($event)"></data-tables>
        </div>
      </ba-card>
    </div>
  </div>
</div>

<div bsModal #applyModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
     aria-labelledby="applyModalLabel" aria-hidden="true" (onHide)="onHideModal()">
  <div class="modal-dialog modal-lg">
    <div class="modal-content" style="color: #000;">
      <div class="modal-header">
        <button class="close" (click)="apprApplyClose()" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">提交申请</h4>
      </div>

      <div class="modal-body">
        <div class="auth-block" *ngIf="applyModalDisplay">
          <form id="applyForm" class="form-horizontal" [formGroup]="applyForm"
                (ngSubmit)="onSubmit()">

            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">人员姓名</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="name" [value]="applyDetailData.certificate.name" readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">性别</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="sex" [value]="applyDetailData.certificate.sex" readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">出生日期</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="birthday" [value]="applyDetailData.certificate.birthday"
                       readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">身份证号</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="idcard" [value]="applyDetailData.certificate.idcard"
                       readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">证书编号</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="serialno" [value]="applyDetailData.certificate.serialno"
                       readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">发证日期</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="issuedate" [value]="applyDetailData.certificate.issuedate"
                       readonly>
              </div>
            </div>
            <div class="form-group row">
              <label for="name" class="col-sm-2 control-label">证书有效期</label>

              <div class="col-sm-10">
                <input type="text" class="form-control" id="availabletime"
                       [value]="applyDetailData.certificate.availabletime" readonly>
              </div>
            </div>

              <div class="form-group row">
                <label class="col-sm-2 control-label">培训记录</label>
                <div class="col-sm-10">
                  <file-upload [url]="fileUploadUrl" [name]="incidentDoc" [fileSizeLimit]="sizeLimit"
                               [disable]="disableUpload"
                               (onFinishUploading)="onFinishUploading($event)"
                               (onUploading)="onFileUploading($event)"></file-upload>
                </div>
              </div>

              <div class="form-group row">
                <label class="col-sm-2 control-label">事故相关文件</label>
                <div class="col-sm-10">
                  <file-upload [url]="fileUploadUrl" [name]="trainRecord" [fileSizeLimit]="sizeLimit"
                               [disable]="disableUpload"
                               (onFinishUploading)="onFinishUploading($event)"
                               (onUploading)="onFileUploading($event)"></file-upload>
                </div>
              </div>
          </form>
        </div>

      </div>
      <div class="modal-footer">
        <span *ngIf="_errorMsg" style="color:red;">{{_errorMsg}}</span>
        <button class="btn btn-primary confirm-btn" (click)="onSubmit()">提交申请</button>
      </div>
    </div>
  </div>
</div>


<div bsModal #apprDeleteModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
     aria-labelledby="entRegApprModalLabel"
     aria-hidden="true" (onHide)="onHideModal()">
  <div class="modal-dialog modal-lg">
    <div class="modal-content" style="color: #000;">
      <div class="modal-header">
        <button class="close" (click)="apprDeleteClose()" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">删除</h4>
      </div>

      <div class="modal-body">
        确定要删除吗
      </div>

      <div class="modal-footer">
        <button class="btn btn-primary confirm-btn" (click)="delete()">删除</button>
        <button class="btn btn-default" (click)="apprDeleteClose()">取消</button>
      </div>
    </div>
  </div>
</div>

<div bsModal #apprReviewModal="bs-modal" class="modal fade" tabindex="-1" role="dialog"
     aria-labelledby="entRegApprModalLabel"
     aria-hidden="true" (onHide)="onHideModal()">
  <div class="modal-dialog modal-lg">
    <div class="modal-content" style="color: #000;">
      <div class="modal-header">
        <button class="close" (click)="apprReviewModal.hide()" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title">详情</h4>
      </div>

      <div class="modal-body">
        <div class="auth-block">
          <form class="form-horizontal" *ngIf="selectedRowData">
            <div class="form-group row"><label class="col-sm-2 form-control-label">姓名</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.name}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">性别</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.sex}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">身份证</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.idcard}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">公司名</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.companyname}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">技术职称</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.technicaltitles}}">
              </div>
            </div>

            <div class="form-group row"><label class="col-sm-2 form-control-label">证书类型</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.type}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">证书编号</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.serialno}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified"><label class="col-sm-2 form-control-label">提交时间</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.submittime}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">签发日期</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.issuedate}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified === '通过'|| applyDetailData.certificate.verified === '未通过'"><label class="col-sm-2 form-control-label">审批时间</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.verifytime}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified === '通过'|| applyDetailData.certificate.verified === '未通过'"><label class="col-sm-2 form-control-label">审批意见</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.verifydescription}}">
              </div>
            </div>
            <div class="form-group row"><label class="col-sm-2 form-control-label">原有效期</label>
              <div class="col-sm-10" *ngIf="applyDetailData.certificate.verified == null">
                <input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.availabletime}}">
              </div>
              <div class="col-sm-10" *ngIf="applyDetailData.certificate.verified">
                <input type="text" class="form-control" readonly
                       value="{{applyDetailData.certificate.oldavailabletime}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified"><label class="col-sm-2 form-control-label">新有效期</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.availabletime}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified"><label class="col-sm-2 form-control-label">状态</label>
              <div class="col-sm-10"><input type="text" class="form-control" readonly
                                            value="{{applyDetailData.certificate.verified}}">
              </div>
            </div>
            <div class="form-group row" *ngIf="applyDetailData.certificate.verified">
              <label class="col-sm-2 form-control-label">培训记录</label>
              <div class="col-sm-10" *ngIf="applyDetailData.files && applyDetailData.files.incidentDoc">
                <a href="applyDetailData.files.incidentDoc.path" download>{{applyDetailData.files.incidentDoc.originalfilename}}
                </a></div>
              <div class="col-sm-10"
                   *ngIf="applyDetailData.files && applyDetailData.files.incidentDoc == null || applyDetailData.files == null">
                <input type="text" class="form-control"
                       value="无下载文件" readonly>
              </div>
            </div>

            <div class="form-group row" *ngIf="applyDetailData.certificate.verified">
              <label class="col-sm-2 form-control-label">事故相关文件</label>
              <div class="col-sm-10" *ngIf="applyDetailData.files && applyDetailData.files.trainRecord">
                <a href="applyDetailData.files.trainRecord.path" download>{{applyDetailData.files.trainRecord.originalfilename}}
                </a></div>
              <div class="col-sm-10"
                   *ngIf="applyDetailData.files && applyDetailData.files.trainRecord == null || applyDetailData.files == null">
                <input type="text" class="form-control"
                       value="无下载文件" readonly>
              </div>
            </div>
          </form>

        </div>
      </div>

      <div class="modal-footer">
        <button class="btn btn-default" (click)="apprReviewModal.hide()">关闭</button>
      </div>
    </div>
  </div>
</div>
